<template>
  <div class="saleReport">
    <jc-title />
    <el-tabs v-model="activeName">
      <el-tab-pane v-if="false" name="grossAnalysis" :label="$t('menu.grossAnalysis')">
        <grossAnalysis />
      </el-tab-pane>
      <el-tab-pane name="otherDetail" :label="$t('market.otherDetail')">
        <otherDetail />
      </el-tab-pane>
      <el-tab-pane name="salesMargin" :label="$t('menu.salesMargin')">
        <salesMargin />
      </el-tab-pane>
      <el-tab-pane name="materialBillSum" :label="$t('market.materialBillSum')">
        <materialBillSum />
      </el-tab-pane>
      <el-tab-pane name="materialList" :label="$t('market.materialList')">
        <materialList />
      </el-tab-pane>
      <el-tab-pane name="finisheCollcet" :label="$t('market.finisheCollcet')">
        <finisheCollcet />
      </el-tab-pane>
      <el-tab-pane name="finisheDetail" :label="$t('market.finisheDetail')">
        <finisheDetail />
      </el-tab-pane>
      <el-tab-pane v-if="false" :label="$t('market.prollDetail')" name="putStorage">
        <put-storage />
      </el-tab-pane>
      <el-tab-pane :label="$t('market.prollDetail') + '(' + $t('market.averageprice') + ')'" name="putStorage1">
        <put-storage url="1" />
      </el-tab-pane>
      <el-tab-pane :label="$t('market.finishWare')" name="finishWare">
        <finishWare />
      </el-tab-pane>
      <el-tab-pane :label="$t('market.salesDealWith')" name="salesDealWith">
        <salesDealWith />
      </el-tab-pane>
      <el-tab-pane :label="$t('market.procureDealWith')" name="procureDealWith">
        <procureDealWith />
      </el-tab-pane>
      <el-tab-pane :label="$t('market.statementExpense')" name="statementExpense">
        <statementExpense />
      </el-tab-pane>
      <el-tab-pane :label="$t('market.productForm')" name="productForm">
        <productForm />
      </el-tab-pane>
    </el-tabs>
  </div>
</template>

<script>

export default {
  name: 'Statements',
  components: {
    PutStorage: () => import('@/views/production/proStatement/component/putStorage'), // 产品领料明细表
    grossAnalysis: () => import('@/views/financial/statements/grossAnalysis'), //
    otherDetail: () => import('@/views/financial/statements/otherDetail'),
    materialList: () => import('@/views/financial/statements/materialList'),
    materialBillSum: () => import('@/views/financial/statements/materialBillSum'),
    finisheCollcet: () => import('@/views/financial/statements/finisheCollcet'),
    finisheDetail: () => import('@/views/financial/statements/finisheDetail'),
    finishWare: () => import('@/views/financial/statements/finishWare'),
    salesDealWith: () => import('@/views/financial/statements/salesDealWith'),
    procureDealWith: () => import('@/views/financial/statements/procureDealWith'),
    statementExpense: () => import('@/views/financial/statements/statementExpense'),
    productForm: () => import('@/views/financial/statements/productForm'),
    salesMargin: () => import('@/views/financial/statements/salesMargin')
  },
  data() {
    return {
      activeName: 'otherDetail' // tab name
    }
  }
}
</script>

<style>
.saleReport .el-tabs {
  width: 100% !important;
}
.saleReport .el-tabs__nav{
  display: flex !important;
  flex-wrap: wrap !important;
  position: unset;
}
</style>
<style scoped lang="scss">
.saleReport {
  @include listBom;
  .el-tabs::v-deep .el-tabs__nav-next,
  .el-tabs::v-deep .el-tabs__nav-prev {
    line-height: 28px;
    font-size: 14px;
  }
  .el-table {
    &::v-deep thead.is-group th {
      padding: 5px 0;
    }
  }
}
.btn1 {
  margin-left: 450px !important;
}

.el-dialog .el-dialog__body{
  //text-align: center;
}
.iframe-content {
  margin: 20px 0;
  display: flex;
  justify-content: center;
}

.el-form {
  display: flex;
}
.productImg{
  height: auto;
  max-height: 30px;
}
.image{
  width: auto;
  height: 100%;
  max-height: 600px;
}
</style>
